<template>
    <view class="bgf5f">
        <view class="fallHeight">
			<view class="f24 font_500 c999 pl-20" style="line-height:70rpx">
				选择反馈类型：
			</view>
            <!-- 投诉金额 -->
			
			<radio-group @change="radioChange" class="bgfff flex center justify-space-between" style="padding: 20rpx 50rpx;">
				<label class="radio flex center" style="margin-right: 30rpx;">
					<radio value="1" checked="true" color="#f14226" style="transform:scale(0.5)"/>
					<view class="f24 c666">bug</view>
				</label>
				<label class="radio flex center">
					<radio value="2" color="#f14226" style="transform:scale(0.5)"/>
					<view class="f24 c666">建议</view>
				</label>
				<label class="radio flex center">
					<radio value="3" color="#f14226" style="transform:scale(0.5)"/>
					<view class="f24 c666">五星好评</view>
				</label>
			</radio-group>
				
			
			<view class="bgfff divClass f28">
				<view class="mt-20">
					<input class="uni-input f28" confirm-type="text" placeholder="添加标题" style="border-bottom: 1px solid #F5F5F5;padding: 10rpx 0;" v-model="title"/>
					<textarea class="f28 mt-10" style="height: 200rpx;" placeholder="请输入反馈信息，我们将及时进行改进" v-model="val_txt"/>
				</view>
			   
			</view>

			<view class="bgfff divClass f28" style="padding-top: 10rpx;">
				<view class="mt-20">
					<input class="uni-input f28" confirm-type="text" placeholder="请输入您的邮箱以便得到及时的答复" v-model="eamil"/>
				</view>
			</view>
        </view>
        <!-- 按钮部分开始 -->
        <view class="w100 button flex center justify-center f40" @click="send">
            <text>
                提交
            </text>
        </view>
        <!-- 按钮部分结束 -->
        
    </view>
</template>

<script>
export default {
    data(){
        return{
            showUploader:false, 
			
			phoneList:[],
			title: '',
			val_txt:'',
			eamil:'',
			radio:'1',
        };
    },
    components:{
        
    },
	onLoad(){
		
	},
    mounted(){

    },
    methods:{
		//选择反馈类型
		radioChange(evt){
			console.log(evt.detail.value);
			this.radio = evt.detail.value;
		},
        //上传图片
        phoneListRead(obj){
            this.showUploader = false;
            this.phoneList.push(obj);
        },
		//提交
		send(){
			let pic_image = '';
			if(this.phoneList.length != 0){
				pic_image = this.phoneList.join(',');
			}
			if(!this.title && !this.val_txt){
				uni.showToast({
					icon:"none",
					title:'标题和反馈信息至少填写一个'
				});
				return;
			}
			
			let parame={
				type:this.radio,
				title: this.title,
				content:this.val_txt,
				image:pic_image,
				email: this.eamil
			}
			uni.showToast({
				icon:"none",
				title:'感谢您的反馈！'
			});
			setTimeout(()=>{
				uni.navigateBack();
			},500);
			
		}
        
    },
}
</script>

<style lang="scss">

.fallHeight {
	height: calc(100vh - 50px - 44px);
	// #ifdef MP
	height: calc(100vh - 50px);
	// #endif
}

.divClass{
    margin-top: 20rpx;
    padding: 20rpx;
}
.button{
    /* #ifndef APP-PLUS-NVUE */
    position: -webkit-sticky;
    /* #endif */
    position: sticky;
    bottom:0; 
    z-index: 99;
    flex-direction: row;
    margin: 0px;
    height: 50px;
    box-shadow:0px 0px .10px 0px rgba(0,0,0,0.12); 
    display: flex;
    background: linear-gradient(#EF3D22,#FE6835);
    color: #FFFFFF;

}

</style>
